<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>CSS 盒子模型</title>

	<style>
		.demo{
			display: inline-block;
			background-color: aqua;
			border: 10px solid yellowgreen;
			padding: 50px;
			margin: 60px;
		}

		.border-demo{
			background-color: yellow;
			width: 300px;
			height: 300px;
			border-style: solid ridge outset dashed;
			border-width: 10px;
			border-color: brown aliceblue magenta lawngreen;

		}
	</style>
</head>

<body>
	<div class="demo">我的偶像是周杰伦</div>
	<div class="border-demo">这是一个边框示例</div>
</body>
</html>